﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Snake.aspx.cs" Inherits="BugSysSolution.JsSnake.Snake" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="../Javascript/jquery-1.8.0.min.js"></script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            当前Snake位置:<span id="ss" style="color: red;"></span><br />
            当前Food位置:<span id="sf" style="color: red;"></span><br />
            当前Snake长度:<span id="sl" style="color: red;"></span><br />
            当前Snake状态:<span id="slive" style="color: red;"></span><br />
        </div>
        <div id="d1" style="top: 85px; position: absolute">
        </div>
    </form>
</body>
</html>
<script type="text/javascript">

    Array.prototype.delByIndex = function (index) {
        if (index < 0) {
            return this;
        }
        else {
            return this.slice(0, index).concat(this.slice(index + 1, this.length));
        }
    }


    var View = function (row, col, width, height) {
        this.row = row;
        this.col = col;
        this.width = width;
        this.height = height;
        this.el = $("<div></div>");
        this.borderwidth = 1;
        this.paddingwidth = 1;
        this._allEl = new Array();

        this._matrix = new Array();

        this.CreateMap = function () {
            for (var i = 0; i < this.row; i++) {
                for (var j = 0; j < this.col; j++) {
                    this.el = $("<div></div>");
                    this.el.css("position", "absolute").css("border", "" + this.borderwidth + "px solid black").css("width", this.width).css("height", this.height);
                    this.el.css("top", i * (this.width + 2 * this.borderwidth + this.paddingwidth));
                    this.el.css("left", j * (this.width + 2 * this.borderwidth + this.paddingwidth));
                    this.el.attr("id", i + "_" + j);
                    this._allEl.push(this.el);
                    $("#d1").append(this.el);


                    this._matrix.push(0);
                }
            }
        }
    }

    var Snake = function (view) {
        this._headPos = { row: 0, col: 0 };
        this._bodys = new Array();
        this._length = 1;
        // 0 xia,1 zuo ,2 shang, 3 you
        this._direction = 0;

        this.time = 0;
        this.CreateSnake = function () {
            var snakeRow = Math.floor(Math.random() * view.row);
            var foodCol = Math.floor(Math.random() * view.col);
            this._headPos.row = snakeRow;
            this._headPos.col = foodCol;
            s1._matrix[snakeRow * view.col + foodCol] = 1;
            this._bodys.push(this._headPos);
        }

        this.CreateFood = function () {
            var foodRow = Math.floor(Math.random() * view.row);
            var foodCol = Math.floor(Math.random() * view.col);

            s1._matrix[foodRow * view.col + foodCol] = 2;
        }
        this.Init = function () {
            view.CreateMap();
            this.CreateSnake();
            this.CreateFood();
            this.loop();
            this.InterVal();
        }

        this.InterVal = function () {
            var that = this;
            this.time = window.setInterval(function () {

                // move to south
                if (s2._direction == 0) {
                    var nextPos = { r: 0, c: 0 };
                    nextPos.r = s2._headPos.row + 1;
                    nextPos.c = s2._headPos.col;
                    if (nextPos.r >= s1.row) {
                        nextPos.r = 0;
                    }

                    // panduan chi
                    if (s1._matrix[nextPos.r * s1.col + nextPos.c] == 2) {
                        // o
                        // o o
                        s1._matrix[nextPos.r * s1.col + nextPos.c] = 1;
                        s2._bodys.splice(0, 0, { row: nextPos.r, col: nextPos.c });
                        s2.CreateFood();
                    }
                    else {
                        // o
                        //   o
                        var lastPos = s2._bodys[s2._bodys.length - 1];
                        s1._matrix[lastPos.row * s1.col + lastPos.col] = 0;
                        s2._bodys = s2._bodys.delByIndex(s2._bodys.length - 1);
                        s2._bodys.splice(0, 0, { row: nextPos.r, col: nextPos.c });
                        s1._matrix[nextPos.r * s1.col + nextPos.c] = 1;
                    }

                    s2._headPos.row = nextPos.r;
                    s2._headPos.col = nextPos.c;
                }
                else if (s2._direction == 1) {
                    var nextPos = { r: 0, c: 0 };
                    nextPos.r = s2._headPos.row;
                    nextPos.c = s2._headPos.col - 1;
                    if (nextPos.c < 0) {
                        nextPos.c = s1.col - 1;
                    }
                    //chi
                    if (s1._matrix[nextPos.r * s1.col + nextPos.c] == 2) {
                        // o
                        // o o
                        s1._matrix[nextPos.r * s1.col + nextPos.c] = 1;
                        s2._bodys.splice(0, 0, { row: nextPos.r, col: nextPos.c });
                        s2.CreateFood();
                    }
                    else {
                        // o
                        //   o
                        var lastPos = s2._bodys[s2._bodys.length - 1];
                        s1._matrix[lastPos.row * s1.col + lastPos.col] = 0;
                        s2._bodys = s2._bodys.delByIndex(s2._bodys.length - 1);
                        s2._bodys.splice(0, 0, { row: nextPos.r, col: nextPos.c });
                        s1._matrix[nextPos.r * s1.col + nextPos.c] = 1;
                    }

                    s2._headPos.row = nextPos.r;
                    s2._headPos.col = nextPos.c;
                }
                else if (s2._direction == 2) {
                    var nextPos = { r: 0, c: 0 };
                    nextPos.r = s2._headPos.row - 1;
                    nextPos.c = s2._headPos.col;
                    if (nextPos.r < 0) {
                        nextPos.r = s1.row - 1;
                    }
                    //chi
                    if (s1._matrix[nextPos.r * s1.col + nextPos.c] == 2) {
                        // o
                        // o o
                        s1._matrix[nextPos.r * s1.col + nextPos.c] = 1;
                        s2._bodys.splice(0, 0, { row: nextPos.r, col: nextPos.c });
                        s2.CreateFood();
                    }
                    else {
                        // o
                        //   o
                        var lastPos = s2._bodys[s2._bodys.length - 1];
                        s1._matrix[lastPos.row * s1.col + lastPos.col] = 0;
                        s2._bodys = s2._bodys.delByIndex(s2._bodys.length - 1);
                        s2._bodys.splice(0, 0, { row: nextPos.r, col: nextPos.c });
                        s1._matrix[nextPos.r * s1.col + nextPos.c] = 1;
                    }

                    s2._headPos.row = nextPos.r;
                    s2._headPos.col = nextPos.c;
                }
                else if (s2._direction == 3) {
                    var nextPos = { r: 0, c: 0 };
                    nextPos.r = s2._headPos.row;
                    nextPos.c = s2._headPos.col + 1;
                    if (nextPos.c >= s1.col) {
                        nextPos.c = 0;
                    }
                    //chi
                    if (s1._matrix[nextPos.r * s1.col + nextPos.c] == 2) {
                        // o
                        // o o
                        s1._matrix[nextPos.r * s1.col + nextPos.c] = 1;
                        s2._bodys.splice(0, 0, { row: nextPos.r, col: nextPos.c });
                        s2.CreateFood();
                    }
                    else {
                        // o
                        //   o
                        var lastPos = s2._bodys[s2._bodys.length - 1];
                        s1._matrix[lastPos.row * s1.col + lastPos.col] = 0;
                        s2._bodys = s2._bodys.delByIndex(s2._bodys.length - 1);
                        s2._bodys.splice(0, 0, { row: nextPos.r, col: nextPos.c });
                        s1._matrix[nextPos.r * s1.col + nextPos.c] = 1;
                    }

                    s2._headPos.row = nextPos.r;
                    s2._headPos.col = nextPos.c;
                }

                for (var r = 0; r < s1.row; r++) {
                    for (var c = 0; c < s1.col; c++) {
                        if (s1._matrix[r * s1.col + c] == 1) {
                            s1._allEl[r * s1.col + c].css("background-color", "red");
                        }
                        else if (s1._matrix[r * s1.col + c] == 2) {
                            s1._allEl[r * s1.col + c].css("background-color", "black");
                        }
                        else {
                            s1._allEl[r * s1.col + c].css("background-color", "white");
                        }
                    }
                }
            }, 1000);
        }

        this.loop = function () {
            document.onkeydown = function (e) {
                switch (e.keyCode) {
                    case 38:
                        s2._direction = 2;
                        break;
                    case 37:
                        s2._direction = 1;
                        break;
                    case 39:
                        s2._direction = 3;
                        break;
                    case 40:
                        s2._direction = 0;
                        break;
                    default:
                        break;
                }
            }
        }
    }
    var s1 = new View(10, 10, 20, 20);
    var s2 = new Snake(s1);
    s2.Init();
</script>
